<%
	String latitude  = request.getParameter("latitude");
	String longitude = request.getParameter("longitude");
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<title>약도 만들기</title>
<link rel="stylesheet" type="text/css" href="/map/css/map.css"/>
<script type="text/javascript" src="http://apis.daum.net/maps/maps3.js?apikey=a678b6c21eb9b7a32be8f4c556f0c66715235c29"></script>
<script type="text/javascript" src="/common/js/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="/map/js/popup.js"></script>
<script type="text/javascript" src="/map/js/map_main.js"></script>
<script type="text/javascript">
window.onload = function() {
	
	po = new daum.maps.LatLng(<%=latitude%>, <%=longitude%>); 
	map = new daum.maps.Map(document.getElementById('map'), { 
		center: po, 
		level: 4, 
		mapTypeId: daum.maps.MapTypeId.ROADMAP 
	});

	var zoomControl = new daum.maps.ZoomControl();
	map.addControl(zoomControl, daum.maps.ControlPosition.RIGHT);

	/*roadview control*/
	/*
	var roadviewControl = document.createElement("div");

	roadviewControl.id = "btnRVControl";

	roadviewControl.style.backgroundImage= "url('img/btn_rv.png')";
	roadviewControl.style.width = "77px";
	roadviewControl.style.height = "27px";
	roadviewControl.style.cursor = "pointer";
	roadviewControl.style.marginTop = "-5px";
	roadviewControl.style.marginLeft = "-13px";
	
	roadviewControl.onclick = function(ev) {
		rvSubmit();
		showRoadView();
	};
	
	map.addControl(roadviewControl, daum.maps.ControlPosition.TOPRIGHT);
	*/

	var btnCloseRv = document.getElementById("rvClose");

	btnCloseRv.onclick = function(ev) {
		hideRoadView(540, 434);
	};
	
	var mapTypeControl = new daum.maps.MapTypeControl();
	map.addControl(mapTypeControl, daum.maps.ControlPosition.TOPRIGHT);

	mark = new daum.maps.Marker({
		position : po 
	});

	mark.setMap(map);
	setZoomLevel(map.getLevel());

	addAddress(<%=latitude%>, <%=longitude%>);

};
</script>
</head>
<body>
<form method="post" name="mapFrm">
<input type="hidden" id="latitude" name="latitude" value="<%=latitude%>"/>
<input type="hidden" id="longitude" name="longitude" value="<%=longitude%>"/>
<div id="wrap">
	<div id="header"><div class="mapText" id="mapHdTxt">약도 만들기- 정보 입력(2/3)</div></div>
	<div id="body">
		<div id="search">
			<div id="step2LeftTop">
				<div class="boldHeaderFont">정보입력</div>
			</div>
			<div id="step2LeftBody">
				<div class="boldHeaderFont">사이즈</div>
				<div id="inputSize">
					<ul>
						<li class="inputList">가로 : <input type="text" name="width" id="width" class="sizeBox" onfocus="javascript:changeClass(this);" onkeyup="javascript:numberCheck(this);"/>px</li>
						<li class="inputList">세로 : <input type="text" name="height" id="height" class="sizeBox" onfocus="javascript:changeClass(this);" onkeyup="javascript:numberCheck(this);"/>px</li>
					</ul>
					<div class="valText">미리보기는 가로 800px, 세로 550px 이하 사이즈만 지원됩니다.</div>
				</div>
				<div class="boldHeaderFont">줌</div>
				<div id="zoom">
					<div id="zoomType">
						<select name="zoom" class="selectType" id="zoomForm" onchange="javascript:changeZoomLevel(this);">
							<option value='2'>레벨2</option><option value='3'>레벨3</option><option value='4'>레벨4</option><option value='5'>레벨5</option><option value='6'>레벨6</option><option value='7'>레벨7</option><option value='8'>레벨8</option><option value='9'>레벨9</option><option value='10'>레벨10</option><option value='11'>레벨11</option>						</select>
					</div>
					<div class="valText">레벨이 낮아질수록 확대 됩니다.</div>
				</div>
				<div class="boldHeaderFont">내용</div>
				<div id="inputContents">
					<textarea name="contents" id="contents" class="contentsForm" onkeyup="javascript:overLayContents(event);"></textarea>
				</div>
				<div id="preBtn"><a href="javascript:showPreView();" id="preView"><img src="/common/images/btn_preview.gif"/></a></div>
			</div>
		</div>
		<div id="mapView">
			<div id="mapHeader"><span class="boldFont">2단계:: 정보입력</span></div>
			<div id="mapPanel">
				<div id="map"></div>
				<div id="rv">
					<div id="rvHeader">
						<div id="rvAddr"></div>
						<div id="rvClose"></div>
					</div>
					<iframe src="" id="rv_frame" name="rv_frame" scrolling="no" frameborder="0" width="0" height="0"></iframe>
				</div>
			</div>
		</div>
	</div>
	<div id="footer">
		<div id="nextBtn">
			<a href="javascript:location.href='/map/map_step1.jsp'"><img src="/common/images/btn_before.gif"/></a>
			<a href="javascript:gotoNextStep();"><img src="/common/images/btn_next.gif"/></a>
		</div>
<!-- 		<div id="closeBtn"><a href="javascript:self.close();"><img src="/common/images/btn_close.gif"/></a></div> -->
	</div>
</div>
<div id="popupContact">
	<div id="preMap">
		<iframe id="previewMap" name="previewMap" height="0" width="0" frameborder="0" scrolling="no"></iframe>
	</div>
</div>
<div id="backgroundPopup"></div>
</form>
</body>
</html>
